<template>
	<view class="pore flexco">
		<image src="../../static/toububg.png" mode="" class="toubuimg zindex99"></image>
		<view class="toububg zindex999 topview box">
			<!-- <image src="../../static/saoyisao.png" mode="" class="saoyisao" @click="saoma"></image> -->
			<view class="flexco">
				<view class="flexst mt30">
					<text class="fs32 cor-ff line60" v-if="!shop_id" @click="denglu">立刻登录</text>
					<text class="fs32 cor-ff line60" v-else>{{ shop_name }}</text>
				</view>
				<view class="flexst">
					<text class="fs39 cor-cb b line60">时间为：{{$u.timeFormat(1581170184, 'yyyy年mm月dd日')}}</text>
				</view>
				<view class="flexad mtb40 box1">
					<view class=" cor-cb">
						<text class="mb10 cor-cb fs28">已结算</text>
						<view class="flexce"><text class="cor-cb b fs39">0</text></view>
					</view>
					<view class=" cor-cb">
						<text class="mb10 cor-cb fs28">待确认</text>
						<view class="flexce"><text class="cor-cb b fs39">0</text></view>
					</view>
					<view class=" cor-cb">
						<text class="mb10 cor-cb fs28">待签约</text>
						<view class="flexce"><text class="cor-cb b fs39">0</text></view>
					</view>
					<view class=" cor-cb">
						<text class="mb10 cor-cb fs28">待出货</text>
						<view class="flexce"><text class=" cor-cb b fs39">0</text></view>
					</view>
					<view class=" cor-cb">
						<text class="mb10 cor-cb fs28">待签收</text>
						<view class="flexce"><text class="cor-cb b fs39">0</text></view>
					</view>
				</view>
			</view>
		</view>
		<view class="flexce kapian pore">
			<image src="../../static/kapian.png" mode="" class="kapianpng"></image>
			<view class="kapianview box">
				<view class="flexst">
					<image src="../../static/zijinzhanghu.png" mode="" class="zijinzhanghu"></image>
					<text class="zongse">资金管理</text>
				</view>
				<view class="flexad mtb40">
					<view class="">
						<text class="fs24 mt10">总收入（元）</text>
						<view class="flexce">
							<text class="b zongse">{{ data.general_income ? data.general_income : 0 }}</text>
						</view>
					</view>
					<view class="">
						<text class="fs24 mt10">在途款（元）</text>
						<view class="flexce">
							<text class="b zongse">{{ data.paragraph_in_transit ? data.paragraph_in_transit : 0 }}</text>
						</view>
					</view>
					<view class="">
						<text class="fs24 mt10">应收款（元）</text>
						<view class="flexce">
							<text class="b zongse">{{ data.account_receivable ? data.account_receivable : 0 }}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="flexbe xiaoxiv">
			<view class="flexst xiaov">
				<view class="pore">
					<image src="../../static/xiaoxiicon.png" mode="" class="xiaoxiicon"></image>
					<!-- 		<text class="xiaoxinum">10</text> -->
				</view>
				<text class="fs28">暂无消息</text>
			</view>
		</view>
		<view class="flexco btnbox box">
			<view class="flexbe btnboxv">
				<view class="btnv" @click="openGoods">
					<view class="flexce"><image src="../../static/shangpingguanli.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">商品管理</text></view>
				</view>
				<view class=" btnv" @click="meitanDingdan">
					<view class="flexce"><image src="../../static/meitandingdan.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">煤炭订单</text></view>
				</view>
				<view class=" btnv" @click="wuliuDingdan">
					<view class="flexce"><image src="../../static/wuliudingdan.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">物流订单</text></view>
				</view>
				<view class=" btnv" @click="collectionRecord">
					<view class="flexce"><image src="../../static/shoukuanjilu.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">收款记录</text></view>
				</view>
			</view>
			<view class="flexbe mt30 btnboxv">
				<view class=" btnv" @click="reportStatistics">
					<view class="flexce"><image src="../../static/baobiaotongji.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">报表统计</text></view>
				</view>
				<view class="btnv" @click="corporateAssets">
					<view class="flexce"><image src="../../static/gongsizichan.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">店铺信息</text></view>
				</view>
				<view class="btnv" @click="wuliuService">
					<view class="flexce"><image src="../../static/wuliufuwu.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">物流服务</text></view>
				</view>
				<view class=" btnv" @click="show = true" v-if="shop_id">
					<view class="flexce"><image src="../../static/tuichudenglu.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">退出登录</text></view>
				</view>
				<view class=" btnv" @click="openLogin" v-else>
					<view class="flexce"><image src="../../static/tuichudenglu.png" mode="" class="btnimg"></image></view>
					<view class="flexce"><text class="fs28">立刻登录</text></view>
				</view>
				<view class="tanceng flexce plr100 box" v-if="show2" :style="{ height: height + 'px' }">
					<view class="bg-ff tishibox3">
						<view class="flexce"><text class="tec fs32">提示</text></view>
						<view class="flexce"><text class="p40 fs30">账号尚未登录，是否登录</text></view>
						<view class="flexbe tcbtnbox line100 bt1 fs30">
							<view class="tec tcbtn brl flexce" @click="show2 = false" hover-class="actbtn brl"><text class="fs28">取消</text></view>
							<view class="tec tcbtn brr flexce" @click="openLogin()" hover-class="actbtn brr"><text class="fs28 lan">确认</text></view>
						</view>
					</view>
				</view>
				<view class="tanceng flexce plr100 box" v-if="show" :style="{ height: height + 'px' }">
					<view class="bg-ff tishibox3">
						<view class="flexce"><text class="tec fs32">提示</text></view>
						<view class="flexce"><text class="p40 fs30">确认退出登录吗？</text></view>
						<view class="flexbe tcbtnbox line100 bt1 fs30">
							<view class="tec tcbtn brl flexce" @click="show = false" hover-class="actbtn brl"><text class="fs28">取消</text></view>
							<view class="tec tcbtn brr flexce" @click="signOut()" hover-class="actbtn brr"><text class="fs28 lan">确认</text></view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<text class="kefu">我的客服</text>
	</view>
</template>

<script setup lang="ts">
import { ref, reactive, toRef } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
import config from '../../../config/config';
const show_modal = ref(false);
const data = reactive({
	shop_id: '',
	shop_name: '',
});
const { shop_info } = toRef(data);
onLoad(() => {
	if (uni.getStorageSync('shopInfo').shop_id) {
		data.shop_id = uni.getStorageSync('shopInfo').shop_id;
		// this.getDetail();
		// this.getName();
	}
	uni.getSystemInfo({
		success: res => {
			uni.setStorageSync('platform', res.platform);
			let system = res.system.split(' ');
			let verions = system[1].split('.');
			uni.setStorageSync('system', +verions[0]);
		}
	});
});

// 商品管理
const openGoods= () => {
	if (uni.getStorageSync('shopInfo').shop_id) {
		uni.navigateTo({
			url: '/pages/goods/goods'
		});
	} else {
		show_modal.value = true;
	}
};

// 煤炭订单
const meitanDingdan = () => {
		uni.navigateTo({
			url: '/pages/goods2/goods2'
		});
};

// 立刻登录
const openLogin = () =>{
	uni.navigateTo({
		url: '/pages/login/login'
	});
}
</script>
<style lang="scss">
page {
	background: #f5f8fb;
}
.toubuimg {
	width: 750rpx;
	height: 500rpx;
}

.toububg {
	position: absolute;
	left: 0;
	top: 0;
	width: 750rpx;
}

.saoyisao {
	width: 40rpx;
	height: 40rpx;
	margin-top: 20rpx;
	margin-left: 10rpx;
}

.zindex99 {
	z-index: 99;
}

.zindex999 {
	z-index: 999;
}

.topview {
	padding: 64rpx 32rpx;
}

.line60 {
	line-height: 60rpx;
}

.mtb40 {
	margin: 40rpx 0;
}

.cor-cb {
	color: #cbcbcb;
}

.mb10 {
	margin-bottom: 10rpx;
}

.kapianpng {
	width: 690rpx;
	height: 230rpx;
}

.zongse {
	color: #7a482e;
}

.zijinzhanghu {
	width: 32rpx;
	height: 32rpx;
	margin-right: 10rpx;
}

.kapianview {
	width: 690rpx;
	height: 230rpx;
	position: absolute;
	left: 0;
	top: 0;
	padding: 30rpx 32rpx;
}

.kapian {
	width: 690rpx;
	height: 230rpx;
	margin-top: -50rpx;
	z-index: 9999;
}

.xiaoxiicon {
	width: 138rpx;
	height: 138rpx;
}

.xiaoxiv {
	background: #ffffff;
	border-radius: 20rpx;
	margin-top: 30rpx;
	width: 690rpx;
	padding-right: 32rpx;
}

.xiaoxinum {
	background: #dc1d32;
	color: #ffffff;
	border-radius: 30rpx;
	padding: 8rpx;
	position: absolute;
	right: 8rpx;
	top: 8rpx;
	font-size: 24rpx;
}

.btnbox {
	background: #ffffff;
	border-radius: 30rpx;
	padding: 32rpx;
	margin: 40rpx 0;
}

.btnv {
	margin: 0 20rpx;
	width: 120rpx;
}

.mt30 {
	margin-top: 30rpx;
}

.kefu {
	width: 200rpx;
	height: 65rpx;
	line-height: 65rpx;
	text-align: center;
	border-radius: 50rpx;
	background: #ffffff;
	color: #dc1d32;
	margin-bottom: 30rpx;
	font-size: 28rpx;
}

.btnimg {
	width: 48rpx;
	height: 48rpx;
	margin: 20rpx 0;
}

.btnboxv {
	width: 640rpx;
}

.box1 {
	width: 686rpx;
}

.xiaov {
	width: 400rpx;
}

.plr100 {
	padding: 0 100rpx;
}

.tishibox {
	border-radius: 20rpx;
	padding-bottom: 40rpx;
	background-color: #ffffff;
}

.tishibox3 {
	border-radius: 20rpx;
	width: 600rpx;
	background-color: #ffffff;
	overflow: hidden;
	padding-top: 50rpx;
}

.line100 {
	line-height: 90rpx;
}

.p40 {
	padding: 40rpx;
}

.tcbtn {
	width: 300rpx;
	height: 100rpx;
	background-color: #ffffff;
}

.tanceng {
	width: 750rpx;
	height: 1334rpx;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999;
	background-color: rgba(0, 0, 0, 0.5);
}

.bt1 {
	border-top: 1px solid rgba(138, 138, 138, 0.1);
}

.tcbtnbox {
	width: 600rpx;
}

.lan {
	color: rgb(41, 121, 255);
}

.actbtn {
	background-color: #e6e6e6;
}

.brl {
	border-radius: 0 0 0 20rpx;
}

.brr {
	border-radius: 0 0 20rpx 0;
}

.mt10 {
	margin-bottom: 10rpx;
}

.mtb30 {
	margin: 35rpx 0;
}

.zijinbox {
	height: 100rpx;
}
</style>
